<template>
	<view class="wrap">
		<u-cell-item title="页面边距" :arrow="false">
			<u-radio-group v-model="pagePadding" @change="pagePaddingChange" slot="right-icon">
				<u-radio name="0"> 无 </u-radio>
				<u-radio name="20"> 小 </u-radio>
				<u-radio name="40"> 中 </u-radio>
				<u-radio name="80"> 大 </u-radio>
			</u-radio-group>
		</u-cell-item>
		<u-cell-item title="段落距离" :arrow="false">
			<u-radio-group v-model="sectionDistance" @change="sectionDistanceChange" slot="right-icon">
				<u-radio name="0"> 小 </u-radio>
				<u-radio name="1"> 中 </u-radio>
				<u-radio name="2"> 大 </u-radio>
			</u-radio-group>
		</u-cell-item>
		<u-cell-item title="行间距离" :arrow="false">
			<u-radio-group v-model="lineDistance" @change="lineDistanceChange" slot="right-icon">
				<u-radio name="30"> 小 </u-radio>
				<u-radio name="38"> 中 </u-radio>
				<u-radio name="60"> 大 </u-radio>
			</u-radio-group>
		</u-cell-item>
		<u-cell-item title="翻页方式" :arrow="false">
			<u-radio-group v-model="pageTurnType" @change="pageTurnTypeChange" slot="right-icon">
				<u-radio name="0"> 滚屏 </u-radio>
				<u-radio name="1"> 上下 </u-radio>
				<u-radio name="2"> 左右 </u-radio>
			</u-radio-group>
		</u-cell-item>
		<u-cell-item title="启动时自动打开最近阅读的书籍" :arrow="false">
			<u-switch slot="right-icon" v-model="openLastRead"></u-switch>
		</u-cell-item>
		<u-cell-item title="阅读时屏幕常亮" :arrow="false">
			<u-switch slot="right-icon" v-model="lightForever"></u-switch>
		</u-cell-item>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pagePadding: '20',
				sectionDistance: '1',
				lineDistance: '38',
				pageTurnType: '0',
				lightForever: false,
				openLastRead: false
			};
		},
		watch:{
			lightForever(val){
				uni.setStorageSync('lightForever',val)
			},
			openLastRead(val){
				uni.setStorageSync('open_last_read',val)
			}
		},
		onLoad() {
			this.getSetting();
		},
		methods: {
			pagePaddingChange(e) {
				this.setSetting()
			},
			sectionDistanceChange(e) {
				this.setSetting()
			},
			lineDistanceChange(e) {
				this.setSetting()
			},
			pageTurnTypeChange(e) {
				this.setSetting()
			},
			// 获取字体缓存
			getSetting() {
				let read_setting = uni.getStorageSync('read_setting');
				if (read_setting) {
					read_setting = JSON.parse(read_setting)
					this.fontSize = read_setting.fontSize;
					this.fontFamily = read_setting.fontFamily;
					this.pagePadding = read_setting.pagePadding;
					this.sectionDistance = read_setting.sectionDistance;
					this.lineDistance = read_setting.lineDistance;
					this.pageTurnType = read_setting.pageTurnType
				};
				let _lightForever = uni.getStorageSync('lightForever');
				if(_lightForever){
					this.lightForever = _lightForever;
				};
				let _openLastRead = uni.getStorageSync('open_last_read');
				if(_openLastRead){
					this.openLastRead = _openLastRead;
				}
			},
			// 设置字体缓存
			setSetting() {
				let read_setting = {
					'fontSize': this.fontSize,
					'fontFamily': this.fontFamily,
					'pagePadding': this.pagePadding,
					'sectionDistance': this.sectionDistance,
					'lineDistance': this.lineDistance,
					'pageTurnType': this.pageTurnType
				}
				uni.setStorageSync('read_setting', JSON.stringify(read_setting))
			},
		}
	};
</script>

<style lang="scss" scoped>

</style>
